<template>
  <common-info-dialog
    :title="dialogTitle"
    :visible.sync="dialogShow"
    @cancel="cancel"
    :infoLoading="infoLoading"
  >
    <common-info-table>
      <common-info-table-cell label="应用名称" width="50%">
        {{ detail.applicationName }}
      </common-info-table-cell>
      <common-info-table-cell label="域名" width="50%"
        >{{ detail.domain }}
      </common-info-table-cell>
      <common-info-table-cell label="IP地址" width="50%"
        >{{ detail.ip }}
      </common-info-table-cell>
      <common-info-table-cell label="端口" width="50%"
        >{{ detail.port }}
      </common-info-table-cell>
      <common-info-table-cell label="所属应用系统">
        {{ detail.businessSystemName }}
      </common-info-table-cell>
      <common-info-table-cell label="备注"
        >{{ detail.remark }}
      </common-info-table-cell>
    </common-info-table>
  </common-info-dialog>
</template>
<script>
import { getInfo } from "@/api/system/application/application";
import { validateEmail } from "@/utils/formValidates";
export default {
  name: "detail",
  props: {
    businessList: {
      type: Array,
      default: () => [],
    },
  },
  data() {
    return {
      dialogTitle: "应用详情",
      dialogShow: false,
      detail: {},
      infoLoading: false,
    };
  },
  methods: {
    cancel() {
      this.reset();
      this.dialogShow = false;
    },
    reset() {
      this.detail = {};
    },
    showDetail(id) {
      this.dialogShow = true;
      this.infoLoading = true;
      getInfo({ id })
        .then((res) => {
          if (res && res.code === 200) {
            this.detail = res.data;
          } else {
            this.$GlobalErrorConfirm("数据加载失败", res.msg);
          }
        })
        .finally(() => (this.infoLoading = false));
    },
    changeVal(val) {
      return this.businessList.find((item) => item.dictValue === `${val}`)
        ?.dictLabel;
    },
  },
};
</script>

<style lang="scss" scoped></style>
